<template>
  <div class="footer">
    <el-row>
      <el-col :span="24">
        <el-col :span="24" style="background-color: #f0f0f0">

        </el-col>
            <!--    合作      -->
          <el-col :span="24" class="cooperation">
            <el-col :span="24">
              <a href="">得间免费小说</a>
              <a href="">华为阅读</a>
              <a href="">红薯中文</a>
              <a href="">趣阅中文</a>
              <a href="">iCiyuan轻小说</a>
              <a href="">魔情言情</a>
              <a href="">神起网</a>
              <a href="">有乐中文网</a>
              <a href="">若看文学</a>
              <a href="">喵阅读</a>
              <a href="">书香云集</a>
              <br>
              <a href="">掌阅企业版代理招募</a>
              <a href="">联系我们</a>
              <a href="">商务合作</a>
              <a href="">关于我们</a>
              <a href="">法律声明</a>
            </el-col>
          </el-col>
        <el-col :span="24" style="text-align: center" class="police">
          <el-col :span="24">
            <a href="">京ICP备11008516号</a>
            <a href="">网络出版服务许可证（总）网出证（京）字第141号</a>
            <a href="">京ICP证090653号</a>
            <a href=""><img src="../assets/110.png" alt="">京公网安备11010502030452</a>
            <br>
            <p>2015 All Rights Reserved XXXX股份有限公司 版权所有</p>
            <p>不良信息举报：jubao@zhangyue.com 举报电话：010-59845699</p>
          </el-col>
        </el-col>
        </el-col>
    </el-row>
  </div>
</template>

<script>

</script>

<style scoped>

.footer>div>div>div:nth-child(1){
  width: 460px;
  height: 138px;
  padding: 0 46px;
  background-color: #e6e6e6;
  border-radius: 10px;
  margin: 40px auto 30px;
  float: none;
}

.footer>div>div>div:nth-child(1){
  font-size: 18px;
  text-align: center;
  color: #212121;
  padding-top: 24px;
}
.ios{
  float: left;
  width: 160px;
  height: 40px;
  border-radius: 5px;
  background-color: #212121;
}
.ios>div:nth-child(1){
  background-image: url("../assets/icon.png");
  background-repeat: no-repeat;
  display: block;
  width: 21px;
  height: 23px;
  background-position: -2px -92px;
  margin: 8px 18px 0;
}
.ios>div:nth-child(2){
  width: 107px;
  height: 39px;
  margin: -30px 56px 6px 51px;
  padding-top: 9px;
  text-align: center;
  color: #fff;
  font-size: 14px;
  border-left: 1px solid #f7f7f7;
}
.android{
  float: right;
  width: 160px;
  height: 40px;
  border-radius: 5px;
  background-color: #4caf50;

}
.android>div:nth-child(1){
  background-image: url("../assets/icon.png");
  background-repeat: no-repeat;
  display: block;
  width: 21px;
  height: 23px;
  background-position: -24px -92px;
  margin: 8px 18px 0;
}
.android>div:nth-child(2){
  width: 107px;
  height: 39px;
  margin: -30px 56px 6px 51px;
  padding-top: 9px;
  text-align: center;
  color: #fff;
  font-size: 14px;
  border-left: 1px solid #f7f7f7;
}
.cooperation{
  text-align: center;
}
.cooperation>div:nth-child(1)>a{
  margin: 0 8px;
  font-size: 14px;
  color: #9e9e9e;
}
.cooperation>div:nth-child(1)>a:hover{
  color:#f26552;
}
.police{
  margin-top: 20px;
}
.police>div:nth-child(1)>a{
  margin: 0 8px;
  font-size: 12px;
  color: #9e9e9e;
}
.police>div:nth-child(1)>p{
  margin: 0 8px;
  font-size: 12px;
  color: #9e9e9e;
}
</style>
